<template>
  <div id='app'>
    <div style="width: 84%;margin: auto">
      <p class="p1">更换手机号后，将以新的手机号登录此账户</p>
      <input type="number" pattern="\d*" placeholder="请输入您的新手机号" class="input1"  maxlength="11" v-model="tel">
      <mt-button type="primary" class="btn111" @click="next()">下一步</mt-button>
    </div>
  </div>
</template>

<script>
    export default {
      name: "Before",
      data() {
        return {
          tel: '',
					oldcode:'',
        }
      },
      methods: {
        next(){
					if(this.tel==''){
						this.$toast({
						  message:'请输入手机号',
						  position:'center'
						});
					}else if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.tel))) {
						this.$toast({
						  message:'请输入正确的手机号',
						  position:'center'
						});
					}else{
						var that = this;
						that.axios.get(that.$store.state.url + "sms/getSmsCode",{
							params:{
								tel:that.tel,
							}
						}).then(res=>{
						  if (res.data.errcode == 0||res.data.errcode == '0'){
						    // console.log(res.data)
						    that.$toast({
						      message:res.data.msg,
						      position:'bottom'
						    });
								sessionStorage.setItem('iscode',1);
								setTimeout(function(){
									that.$router.push({
										path:'/code',
										query:{
											t:that.tel,
											oldcode:that.oldcode
										}
									})
								},1000)
						  }else {
						    that.$toast({
						      message:res.data.msg,
						      position:'bottom'
						    });
						  }
						
						})
						
					}
				}
      },
			mounted(){
				this.sdk.getJSSDK('','',this.$store.state.url);	
				var oldcode = this.$route.query.oldcode;
				this.oldcode=oldcode;
			}
    }
</script>

<style scoped>
	/* #app{
		font-size: .2rem;
	} */
  .p1{
    font-size:0.24rem;
    font-weight:500;
    color:rgba(153,153,153,1);
    margin-top: 1rem;
  }
  .input1{
    width: 100%;
    height: 0.7rem;
    border-bottom: 0.01rem solid rgba(237,237,237,1);
    margin-top: 1.2rem;
		font-size: .3rem;
  }
  .input1::placeholder{
    font-size:0.3rem;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(153,153,153,1);
  }
  input:focus::placeholder{
    color: transparent;
  }
  .btn111{
    width: 100%;
    height: 0.88rem;
    margin-top: 0.93rem;
    border-radius:0.44rem;
    font-size: 0.3rem;
    background:rgba(2,135,255,1);
  }
</style>
